<template>
    <div class="input-wrap">
        <span>{{text}}</span>
        <input :type="type" :placeholder="placeholder" v-model="content" @blur="sendContent">
    </div>
</template>

<script>
    export default {
        name:"Input-Location",
        props:['text','type','placeholder','tipText','value'],
        data(){
            return {
                content:''
            }
        },
        methods: {
            sendContent(){
                this.$emit('getInfo',this.content)
            }
        },
        mounted() {
            this.content = this.value
        },
    }
</script>

<style scoped lang="less">
    .input-wrap{
        width: 95%; 
        margin: 0 auto;
        border-bottom: 1px solid rgb(235, 232, 232);
        padding: 15px 0;
        display: flex;
        justify-content: space-between;

    }
    span{
        display: block;
        width: 80px;
        font-size: 14px;
        line-height: 30px;
    }
    input{
        width: 260px;
        height: 30px;
        padding-left:5px;
        border: none;
        outline: none;
        transition: .4s;
        color: #999;
        font-size: 14px;
    }
    input::placeholder{
        font-size: 14px;
        color: #999;
    }
</style>